<g:setProvider library="jquery"/>
<head>

<title>Login</title>
<style type='text/css' media='screen'>
#login {
	margin:15px 0px; padding:0px;
	text-align:center;
}
#login .inner {
	width:260px;
	margin:0px auto;
	text-align:left;
	padding:10px;
	border-top:1px dashed #499ede;
	border-bottom:1px dashed #499ede;
	background-color:#EEF;
}
#login .inner .fheader {
	padding:4px;margin:3px 0px 3px 0;color:#2e3741;font-size:14px;font-weight:bold;
}
#login .inner .cssform p {
	clear: left;
	margin: 0;
	padding: 5px 0 8px 0;
	padding-left: 105px;
	border-top: 1px dashed gray;
	margin-bottom: 10px;
	height: 1%;
}
#login .inner .cssform input[type='text'] {
	width: 120px;
}
#login .inner .cssform label {
	font-weight: bold;
	float: left;
	margin-left: -105px;
	width: 100px;
}
#login .inner .login_message {color:red;}
#login .inner .text_ {width:120px;}
#login .inner .chk {height:12px;}
</style>
</head>

<body>
  <div id="container">
  <div id="center" class="column">
  <div class="tabContent" style="position:relative">
	<div id='login'>
		<div class='inner'>
			<g:if test='${flash.message}'>
			<div class='login_message'>${flash.message}</div>
			</g:if>
			<div class='fheader'>Please Login..</div>
			<form id='loginForm' class='cssform'>
				<p>
					<label for='j_username'>Login ID</label>
					<input type='text' class='text_' name='j_username' id='j_username' value='${request.remoteUser}' />
				</p>
				<p>
					<label for='j_password'>Password</label>
					<input type='password' class='text_' name='j_password' id='j_password' />
				</p>
				<p>
					<label for='remember_me'>Remember me</label>
					<input type='checkbox' class='chk' name='_spring_security_remember_me' id='remember_me'
					<g:if test='${hasCookie}'>checked='checked'</g:if> />
				</p>
				<p>
					<input type='button' value='Login' onClick="login()"/>
				</p>

			</form>
                                <p>
                                    <ul>
                                          <li><g:remoteLink controller="register" action="index" update="menu-content">Please register first if you are new user.</g:remoteLink></li>
                                          <li>Forget <g:remoteLink controller="user" action="requestUserName" update="menu-content">user name</g:remoteLink> or <g:remoteLink controller="user" action="requestPassword" update="menu-content">password</g:remoteLink></li>
                                    </ul>
                                </p>
		</div>
          
        </div>
  </div>
    </div>
    </div>
<script type='text/javascript'>
<!--
(function(){
    document.forms['loginForm'].elements['j_username'].focus();
})();

function login() {
    var masterinfo = $("#loginForm input").serialize();
    var url = "http://${request.getHeader('host')}${request.getContextPath()}/";
    $.ajax({
        type: "POST",
        url: url + "j_spring_security_check",
        data: masterinfo,
        success: function(data) {
          if (data.indexOf('error') == 0) {
            var d = data.split(':');
            alert(d[1]);
          }
          else {
            window.location.reload(true);
          }
        }
    });
}

// -->
</script>
</body>
